import Creater from "./creater";
import Service from "./service";

export default {
  /**
   * @param {Object} Vue VUE对象自身
   * @param {Object} options 自定义配置项
   */
  install(Vue, options = {}) {
    const services = new Service(options, Vue);
    Vue.prototype.$Focus = services;
    Vue.directive("items", {
      bind(elem, binding, vnode) {
        // 注册焦点
        services.register(new Creater(elem, binding, vnode));
      },
      componentUpdated(elem, binding, vnode) {
        // 更新焦点
        services.updater(elem, binding, vnode);
      },
      unbind(elem) {
        // 删除焦点
        services.remover(elem, true);
      },
    });
    Vue.directive("group", {
      bind(elem, binding, vnode) {
        // 注册区域
        services.register(new Creater(elem, binding, vnode));
      },
      componentUpdated(elem, binding, vnode) {
        // 更新区域
        services.updater(elem, binding, vnode);
      },
      unbind(elem) {
        // 删除区域
        services.remover(elem);
      },
    });
    Vue.mixin({
      beforeRouteEnter(to, from, next) {
        services.monitor = false;
        services.createView(to);
        if (from.name !== to.name) {
          // 不同页面跳转时初始化按键响应内容
          services.setkeyHandle();
        }
        next((vm) => {
          services.monitor = true;
          let str = services.$options.includeAttr;
          str && typeof str === "string" && vm.$store.commit(str);
        });
      },
    });
  },
};
